<template>
	<!--订单详情-->
	<view class="page-content">
		<view class="page-top">
			<!--订单详情信息-->
			<order-top-info :obj="objdata.useraddress" @todetail="todetail"></order-top-info>
			<!--橱窗-->
			<block v-for="(item,index) in objdata.list" :key="index">
				<view class="page-top-box">
					<product-number :obj="item" pageType="prop"></product-number>
				</view>
			</block>
			
		</view>
		<view class="page-body">
			<!--流程-->
			<view class="page-body-title">批注</view>
			<view class="input-row2">
				<textarea class="input-row-w" v-model="objdata.txt" placeholder-style="color:#ccc" placeholder="请输入内容" />
			</view>
		</view>
		<view class="page-foot">
			<view class="page-foot-l">
				<view class="box-foot-l" v-if="objdata3.head_img!=''">
					<image class="box-foot-l-img" :src="objdata3.head_img"></image>
				</view>
				<view class="box-foot-l" v-else>
					<view class="box-foot-l-b" @click="toAdd(objdata3.id)">+</view>
				</view>
			</view>
			<view class="page-foot-r">
				<view class="page-foot-r-t" @click="toPast">确认下单</view>
			</view>
		</view>
	</view>
</template>

<script>
	import orderTopInfo from '@/pages/components/order_top_info.vue'; //地址
	import productNumber from '@/pages/components/product_number.vue'; //产品信息+橱窗
	export default{
		components: {
			orderTopInfo,productNumber
		},
		data() {
			return {
				unfold:false, //是否查看更多
				objdata3:{
					head_img:'',
				},
				objdata:{
					useraddress:{
						name: '张三',
						mobile: '1347627347',
						address: '福建省厦门市湖里区吕玲路江头街道大儒世家119号',
					},
					list:[
						{
							pro_img: '/static/data-img/img.jpg',
							pro_name: 'XX系列图片系列图片系列图片',
							pro_txt: ['男', '鞋', '都市'],
							remark: '此订单需注意尺寸',
							datalist:[{
								pro_name:'易拉宝',
								texture:['塑料','玻璃','棉'],
								list:[{
									is_edit:1,
									name:'1米版',
									type:2,
									sizew:'',
									sizeh:'',
									num:0
								},{
									is_edit:2,
									name:'2米版',
									type:2,
									sizew:'500',
									sizeh:'370',
									num:0
								},{
									is_edit:2,
									name:'3米版',
									type:2,
									sizew:'500',
									sizeh:'370',
									num:0
								}]
							},{
								pro_name:'画册',
								texture:['塑料','玻璃','棉'],
								list:[{
									is_edit:1,
									name:'285mmx285mm',
									type:2,
									sizew:'',
									sizeh:'',
									num:0
								},{
									is_edit:2,
									name:'285mmx210mm',
									type:2,
									sizew:'500',
									sizeh:'370',
									num:0
								},{
									is_edit:2,
									name:'250mmx250mm',
									type:2,
									sizew:'500',
									sizeh:'370',
									num:0
								}]
							}]
						}
					]
				}
			}
		},
		onLoad() {
			this.getList();
		},
		methods:{
			//跳转地址列表
			todetail(){
				uni.navigateTo({
					url:`/pages/address/address`
				})
			},
			//调整指派人员页面
			toAdd(id){
				uni.navigateTo({
					url: `/pages/designate/des_one?id=${id}`
				})
			},
			//通过
			toPast(){
				if(this.objdata3.head_img===''){
					
				}
				
			},
			getList(){
				
			},
			checkmore(){
				this.unfold = !this.unfold
				this.getList()
			}
		}
	}
</script>

<style lang="scss">
	.page-content{
		display: flex;
		flex-direction: column;
		.page-foot{
			display: flex;
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			height: 100rpx;
			background: #f5f5f5;
			.page-foot-l{
				flex: 3;
				display: flex;
				align-items: center;
				padding-left: 30rpx;
				.box-foot-l{
					display: flex;
					align-items: center;
					.box-foot-l-b{
						width: 46rpx;
						height: 46rpx;
						background: #198FFF;
						border-radius: 4rpx;
						color: #fff;
						line-height: 44rpx;
						text-align: center;
					}
					.box-foot-l-img{
						width: 46rpx;
						height: 46rpx;
						bborder-radius: 4rpx;
						margin-right: 14rpx;
					}
				}
			}
			.page-foot-r{
				flex: 1;
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 36rpx;
				line-height: 100rpx;
				font-weight: bold;
				color:$font-color-w;
				text-align: center;
				
				.page-foot-r-t{
					flex: 1;
					background: #198FFF;
				}
			}
		}
		.page-top{
			display: flex;
			flex-direction: column;
			.page-top-box{
				border-bottom: 20rpx solid #f5f5f5;
			}
			.loadMore{
			    display: flex;
			    justify-content: center;
			    color: $font-color-3;
			    font-size: 26rpx;
				height: 60rpx;
				line-height: 60rpx;
				background: $uni-bg-color-grey;
			    .sel-input-icon{
			        margin-left: 8rpx;
			        font-size: 26rpx;
			        transform:rotate(-90deg);
			        -ms-transform:rotate(-90deg); 	/* IE 9 */
			        -moz-transform:rotate(-90deg); 	/* Firefox */
			        -webkit-transform:rotate(-90deg); /* Safari 和 Chrome */
			        -o-transform:rotate(-90deg);
			    }
			    .sel-input-icon2{
			        margin-left: 8rpx;
			        font-size: 26rpx;
			        transform:rotate(90deg);
			        -ms-transform:rotate(90deg); 	/* IE 9 */
			        -moz-transform:rotate(90deg); 	/* Firefox */
			        -webkit-transform:rotate(90deg); /* Safari 和 Chrome */
			        -o-transform:rotate(90deg);
			    }
			}
		}
		.page-body{
			display: flex;
			flex-direction: column;
			padding: 40rpx 30rpx;
			margin-bottom: 50rpx;
			.page-body-title{
				font-size: 32rpx;
				font-weight: 400;
				height: 36rpx;
				line-height: 36rpx;
				color: $font-color-3;
				border-left: 6rpx solid #198FFF;
				color: $font-color-3;
				padding-left: 20rpx;
			}
			.input-row2 {
				margin: 30rpx 0 50rpx 0;
				padding: 10rpx 20rpx;
				height: 340rpx;
				display: flex;
				width: 100%;
				flex-direction: row;
				border: 1rpx solid #198FFF;
				border-radius: 10rpx;
			
				.input-row-w {
					display: flex;
					height: 320rpx;
					flex: 1;
					width: 100%;
					color: $font-color-3;
					font-size: 32rpx;
				}
			}
		}
	}
</style>
